<template>
  <div style="padding-top:40px;">
    <group title="修改密码：">
      <x-input type="password" v-model='password' placeholder="旧密码"></x-input>
      <x-input type="password" v-model='newpassword' placeholder="新密码"></x-input>
      <x-input type="password" v-model='comfirmpassword' placeholder="确认密码"></x-input>
    </group>

    <div v-transfer-dom>
      <alert v-model="show1" title="错误提示">确认密码与新密码不匹配！</alert>
      <alert v-model="show" title="错误提示">请输入新密码和旧密码！</alert>
      <alert v-model="show2" title="错误提示">新密码不能为空！</alert>
      <alert v-model="show3" title="错误提示">旧密码不能为空！</alert>
      <alert v-model="show4" title="错误提示">密码不能小于六位！</alert>
      <alert v-model="show5" title="错误提示">原密码不正确！</alert>
      <alert v-model="show6" title="错误提示">修改成功！</alert>
    </div>

    <group>
      <x-button type="primary" @click.native="update">确认修改</x-button>
    </group>
  </div>
</template>
<script>
 import {Group, XInput, XButton, Alert, TransferDomDirective as TransferDom} from 'vux'
export default{
   directives: {
     TransferDom
   },
   components: {
     Group,
     XInput,
     XButton,
     Alert
   },
   data () {
     return {
       password: '',
       newpassword: '',
       comfirmpassword: '',
       show: false,
       show1: false,
       show2: false,
       show3: false,
       show4: false,
       show5: false,
       show6: false
     }
   },
   methods: {
     update () {
       var pwd = ''
       this.$http.get('/api/ac/user/selfInfo').then((res) => {
         pwd = res.data.content.password
         if (this.password !== pwd) {
           this.show5 = true
         } else if (this.newpassword === '' && this.password === '' && this.comfirmpassword === '') {
           this.show = true
         } else if (this.newpassword !== this.comfirmpassword) {
           this.show1 = true
         } else if (this.password === '') {
           this.show3 = true
         } else if (this.newpassword === '') {
           this.show2 = true
         } else if (this.password.length < 6 || this.newpassword.length < 6 || this.comfirmpassword.length < 6) {
           this.show4 = true
         }
         if (this.password !== '' && this.newpassword !== '' && this.comfirmpassword !== '' && this.password !== this.newpassword && this.newpassword === this.comfirmpassword) {
           this.$http.put('/api/ac/user/password', {}, {params: {'password': this.password, 'repassword': this.comfirmpassword}}).then((res) => {
             this.show6 = true
             this.password = ''
             this.newpassword = ''
             this.comfirmpassword = ''
           })
         }
       })
     }
   }
}
</script>
<style>

</style>
